var allData = {};
$(function () {
    $("#role_datagrid").datagrid({
        fit:true,
        url:"/role/list",
        fitColumns:true,
        pagination:true,//分页
        rownumbers:true,
        striped:true,//斑马线
        //为true,只允许选择一行
        singleSelect:true,
        toolbar:"#tb",
        columns:[[
            {field:"x",checkbox:true},            //设置复选框
            {field:"id",title:"编号",hidden:true}, //为id设置隐藏域
            {field:"sn",title:"编码",width:100},
            {field:"name",title:"角色名称",width:100 ,formatter: function (value,row) {
                return "<p>"+row.name+"</p>"
            }}

        ]]
    });
    //end-role_datagrid

    $("#role_dialog").dialog({
        width:600,
        height:400,
        closable:true, //可以关闭
        closed:true, //默认是关闭的
        buttons:"#bb" //添加底部的保存|取消的按钮
    })


    //所有权限
    $("#allPermissions").datagrid({
        title:"所有权限",
        width:250,
        height:350,
        url:"/permission/list",
        //pagination:true,  //分页:为了把所有权限都显示出来
        rownumbers:true,
        fitColumns:true,
        columns:[[
            {field:"id", title:"编号", hidden:true},
            {field:"name", title:"权限名", width:100, align:'center'}
        ]],
        onDblClickRow:function(index, row){
            //双击删除一个
            $("#allPermissions").datagrid("deleteRow", index);
            //目标添加1个
            $("#selfPermissions").datagrid("appendRow", row);
        },
        onLoadSuccess:function(data){
            //此方式是有问题, 原因: data直接是地址赋值,修改时, allData也会发生, 应该采用拷贝方式
            //allData =  data;  //将加载的数据缓存起来
            allData = $.extend( true, {}, data);
            console.log(allData);
        }
    });

    //自己拥有的权限
    $("#selfPermissions").datagrid({
        title:"自身权限",
        width:250,
        height:350,
        rownumbers:true,
        fitColumns:true,
        columns:[[
            {field:"id", title:"编号", hidden:true},
            {field:"name", title:"权限名", width:100, align:'center'}
        ]],
        onDblClickRow:function(index, row){
            //双击删除一个
            $("#selfPermissions").datagrid("deleteRow", index);
            //目标添加1个
            $("#allPermissions").datagrid("appendRow", row);
        },
        //数据加载成功之后, 执行去除重复的操作
        onLoadSuccess:function(data){
            //data 表示加载所有数据 格式: {total:2, rows:[...]}
            //1:获取自己拥有的权限, 转成id  等价: data.rows;
            var rows = $("#selfPermissions").datagrid("getRows");
            //迭代rows集合, 将每一个row的id返回,封装成一个id数组
            var ids = $.map(rows, function(row){
                return row.id;
            })

            //2:获取所有的权限数组集合
            var allRows = $("#allPermissions").datagrid("getRows");
            //3:迭代所有权限中的选项id判断是否在 ids 数组中 如果在删除
            for(var i = allRows.length-1; i >= 0; i--){
                //如果存在, 删除
                if($.inArray(allRows[i].id, ids) >= 0){
                    $("#allPermissions").datagrid("deleteRow", i);
                }
            }
        }
    });
})

//添加
function add(){
    //由于添加和编辑公用一个对话框,所以需要事先将对话框中form表单的内容清空
    $("#editForm").form("clear");

    //弹框前, 加载缓存数据(所有权限)
    $("#allPermissions").datagrid("loadData", allData);

    //将自身权限清空
    $("#selfPermissions").datagrid("loadData", []);

    //打开对话框
    $("#role_dialog").dialog("open");
    //将其标题设置为添加
    $("#role_dialog").dialog("setTitle","角色添加");
}

//编辑
function edit(){
    //获取表格中选中的那一行数据
    var row = $("#role_datagrid").datagrid("getSelected");
    if (!row){
        $.messager.alert("温馨提示","请选择要编辑的数据");
        return;
    }
    //清空form表单的数据
    $("#editForm").form("clear");
    //角色 的数据要手动设置
    $("#editForm").form("load",row);

    //弹框前, 加载缓存数据
    $("#allPermissions").datagrid("loadData", allData);

    //发起请求获取当前选中角色拥有权限
    //如何给datagrid加url
    var options = $("#selfPermissions").datagrid("options");
    //给datagrid加一个url路径, 用于加载数据
    options.url = "/permission/queryPermissionByRoleId?roleId=" + row.id;
    //正式加载
    $("#selfPermissions").datagrid("load");
    $("#role_dialog").dialog("open");
    $("#role_dialog").dialog("setTitle","角色编辑");
}

//保存
function save(){
    //先获取角色的id
    var id = $("#roleId").val();
    var url = "/role/save";
    //判断id,如果有值,说明是在编辑
    if (id){
        url="/role/update";
    }
    //
    $("#editForm").form("submit",{
        url:url,
        //提交之前做操作, return是false表不提交
        onSubmit: function(param){
            var rows = $("#selfPermissions").datagrid("getRows");
            for(var i = 0; i < rows.length; i++){
                param["permissions["+i+"].id"]= rows[i].id;
            }
        },
        success:function(data){
        var json = $.parseJSON(data);
        if(!json.success){
            $.messager.alert("温馨提示",json.msg);
        }else{
            $.messager.alert("温馨提示","保存成功");
            //关闭对话框
            $("#role_dialog").dialog("close");
            //刷新表格数据
            $("#role_datagrid").datagrid("load");
        }}
    });
}

//删除
function removing(){
    //判断是否选中数据
    var row = $("#role_datagrid").datagrid("getSelected");
    if(!row){
        $.messager.alert('温馨提示',"请选择要删除的数据");
        return;
    }

    $.messager.confirm('确认','您确认想要执行这个操作？',function(r){
        if (r){

            //1:发起请求修改状态
            $.get("/role/delete",{id:row.id}, function(data){
                if(data.success){
                    $.messager.alert('温馨提示',"删除成功");
                    //2:刷新列表数据
                    role_datagrid.datagrid("load");
                }else{
                    $.messager.alert('温馨提示',data.msg);
                }
            })
        }
    });
}

//刷新
function reload(){
    $("#role_datagrid").datagrid("load");
}

//取消
function cancel(){
    $("#role_dialog").dialog("close");
}